<template>
    <Tabbar>
        <TabbarItem link="/home">
            <img slot="tab-icon" src="~assets/img/tabbar/home.svg" alt="首页">
            <img slot="tab-icon-active" src="~assets/img/tabbar/home_active.svg" alt="首页">
            <div slot="tab-text">首页</div>
        </TabbarItem>
        <TabbarItem link="/category">
            <img slot="tab-icon" src="~assets/img/tabbar/category.svg" alt="分类">
            <img slot="tab-icon-active" src="~assets/img/tabbar/category_active.svg" alt="分类">
            <div slot="tab-text">分类</div>
        </TabbarItem>
        <TabbarItem link="/cart">
            <img slot="tab-icon" src="~assets/img/tabbar/cart.svg" alt="购物车">
            <img slot="tab-icon-active" src="~assets/img/tabbar/cart_active.svg" alt="购物车">
            <div slot="tab-text">购物车</div>
        </TabbarItem>
        <TabbarItem link="/profile">
            <img slot="tab-icon" src="~assets/img/tabbar/profile.svg" alt="我的">
            <img slot="tab-icon-active" src="~assets/img/tabbar/profile_active.svg" alt="我的">
            <div slot="tab-text">我的</div>
        </TabbarItem>
    </Tabbar>
</template>

<script>
    import Tabbar from 'components/common/tabbar/Tabbar'
    import TabbarItem from 'components/common/tabbar/TabBarItem'
    export default {
        name: "MainTabbar",
        components: {
            Tabbar,
            TabbarItem
        }
    }
</script>

<style scoped>

</style>